$(function () {
	$.ajax({
		url: 'http://localhost:8080/hotCity/showHotCity',
		async: false,
		type: 'GET',
		// headers: {
		//     "token": sessionStorage.getItem('token')
		// },
		success: function (rs) {
			if (rs.code === 2001) {
				var cities = rs.t;
				console.log(cities);
				var maxShow = 6;
				var show = cities.slice(0, maxShow);
				show.forEach(function (city) {
					createHotCity(city);
				})
			} else {
				alert(rs.message);
			}
		},
		error: function (xhr, status, error) {
			alert("请求失败！");
			console.error("Error:", status, error);
		}
	})

	function createHotCity(data) {
		// 创建最外层的 div 并添加到容器
		var outerDiv = $('<div></div>').addClass('col-lg-4 col-md-6');
		$('.hotCity').append(outerDiv);

		// 创建 content-blog blog-grid div
		var contentBlog = $('<div></div>').addClass('content-blog blog-grid').attr({
			'data-aos': 'fade-up',
			'data-aos-duration': '1200'
		});
		outerDiv.append(contentBlog);

		// 创建 inner div
		var inner = $('<div></div>').addClass('inner');
		contentBlog.append(inner);

		// 创建 thumbnail div
		var thumbnail = $('<div></div>').addClass('thumbnail');
		inner.append(thumbnail);

		// 创建 a 链接并添加到 thumbnail div
		var aLink = $('<a></a>').attr('href', 'list.html');
		thumbnail.append(aLink);

		// 创建 img 并添加到 a 链接
		var img = $('<img>').attr({
			'src': data.cityImage,
			// 'id': 'zhanqiao',
			'alt': 'Blog Images',
			'width': '455px',
			'height': '302px'
		});
		aLink.append(img);

		// 创建 blog-category div
		var blogCategory = $('<div></div>').addClass('blog-category');
		thumbnail.append(blogCategory);

		$('<a></a>').attr({
			'id': data.cityName,
			'class': "xiangqing2"
		}).text('详情').appendTo(blogCategory);

		// 创建 content div
		var content = $('<div></div>').addClass('content');
		inner.append(content);

		// 创建 h5 标题
		var h5 = $('<h5></h5>').addClass('title');
		content.append(h5);

		// 创建 a 链接（标题）
		$('<a></a>').attr('href', 'list.html').html(data.cityName + '-' + data.cityTitle).appendTo(h5);

		// 创建 read-more-btn div
		var readMoreBtn = $('<div></div>').addClass('read-more-btn');
		content.append(readMoreBtn);
	}

	$(".xiangqing2").click(function () {
		var city = $(this).attr("id");
		window.location.href = 'list.html?city=' + city;
	});

})